<template>
  <div>
    <div>
      <table align="center">
        <tr v-for="(i,index) in list" :key="i">
          <td>{{i.label}}</td>
          <td>
            <input type="text" placeholder="请输入" v-model="names[index]">
          </td>
          <td>类型</td>
          <td>
            <select name="" id="" v-model="types[index]">
              <option value="text">文本框</option>
              <option value="radio">单选框</option>
              <option value="checkbox">复选框</option>
              <option value="date">日期框</option>
              <option value="file">文件上传</option>
              <option value="select">下拉菜单</option>
            </select>
          </td>
          <td>
            <van-field label='值' v-model='values[index]'/>
            <van-button @click='getsource(index)'>选择数据源</van-button>
          </td>
        </tr>
        <button @click="add">+</button>&emsp;
        <button @click="submit">确定</button>
      </table>
      <el-dialog v-model="dialogTableVisible" title="Shipping address">
        <el-table
            ref="singleTable"
            :data="tableData"
            highlight-current-row
            style="width: 100%"
            @current-change="handleCurrentChange"
        >
          <el-table-column type="index" width="50" />

          <el-table-column property="name" label="Name" width="120" />

        </el-table>

      </el-dialog>
    </div>
    <div>

    </div>
  </div>
</template>

<script>
import maxios from "@/http/axios";

export default {
name: "workflow_parames",
  data(){
    return{
      list:[{'label':'名称'}],
      names:{},
      types:{},
      values:{},
      dialogTableVisible:false,
      gridData:[{'id':1,'name':'请假类型数据源'},{'id':2,'name':'会议地址数据源'}],
      tableData: [],
    }
  },
  methods:{
    submit(){
      //获取输入的所有值
      let tlist=[]
      for(var i=0;i<this.list.length;i++){
        let dict = {'lable':this.names[i],'type':this.types[i],'values':this.values[i]}
        tlist.push(dict)
      }
      console.log(tlist)
    },
    add(){
      this.list.push({'label':'名称'})
    },
    getsource(index){
      localStorage.setItem('index',index)
      maxios('/user/origin','get').then(res=>{
        if(res.code==200){
          this.tableData = res.matter
          this.dialogTableVisible = true
        }else{
          alert(res.matter)
        }
      })
    },
    handleCurrentChange(val) {
      this.dialogTableVisible=false
      let index = localStorage.getItem('index')
      this.values[index] = JSON.stringify(val['mes'])
    },
  },
  mounted() {
  }
}
</script>

<style scoped>

</style>